<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<style>
		div{
			/* 100vw view width 占满设备屏幕视口区域宽度100% */
			/* 100vh view height 占满设备屏幕视口区域高度100% */
			width: 100vw;
			height: 300px;
			background-color: red;
			text-align: center;
			line-height: 300px;
		}
		div span{
			/* 设置文字过渡 ,隔开多对过渡属性 */
			transition:font-size 2s linear 0s,color 2s linear 0s;
		}
		div:hover span{
			font-size: 90px;
			color: white;
		}
	</style>
</head>

<body>
	<div>
		<span>盐</span>
		<span>城</span>
		<span>师</span>
		<span>范</span>
		<span>学</span>
		<span>院</span>
	</div>
</body>

</html>